<style lang="less" scoped>
@import "./recharge.less";
</style>
<template>
  <div>
      <Row>
            <Col span="24">
                <Card>
                    <p slot="title" style="height: 32px">
                            全部新增:<span style="color:#f00">&yen;{{ created }}</span>
                      
                    </p>
                    <div>
                            <Table :columns="columnsList" :data="tableData" border disabled-hover></Table>
                    </div>
                    <div class="margin-top-15" style="text-align: center">
                            <Page :total="tableShow.listCount" :current="tableShow.currentPage" :page-size="tableShow.pageSize" @on-change="changePage" @on-page-size-change="changeSize" show-elevator show-sizer show-total></Page>
                    </div>
                </Card>
            </Col>
        </Row>
  </div>
</template>
<script>
const resourse = "recharge";
import axios from "axios";
export default {
  data() {
    return {
      columnsList: [
        {
          title: "序号",
          type: "index",
          align: "center"
        },
        {
          title: "订单号",
          key: "order_id",
          align: "center"
        },
        {
          title: "昵称",
          //   key: "title",
          align: "center",
          render: (h, params) => {
            return h("div", params.row.user.name);
          }
        },
        {
          title: "用户",
          //   key: "title",
          align: "center",
          render: (h, params) => {
            return h("div", params.row.user.real_name);
          }
        },
        {
          title: "手机号",
          //   key: "title",
          align: "center",
          render: (h, params) => {
            return h("div", params.row.user.phone);
          }
        },
        {
          title: "金额",
          key: "money",
          align: "center"
        },
        {
          title: "时间",
          key: "create_time",
          align: "center"
        },
        {
          title: "状态",
          align: "center",
          render: (h, params) => {
            return h(
              "Tag",
              {
                props: {
                  color: params.row.status == 1 ? "green" : "red"
                }
              },
              params.row.status == 1 ? "充值成功" : "充值失败"
            );
          }
        }
      ],
      tableData: [],
      tableShow: {
        listCount: 0,
        currentPage: 1,
        pageSize: 10
      },
      created: 0.0,
      
    };
  },
  created() {
    axios.get("recharge/create").then(response => {
      let res = response.data;
      if (res.code === 200) {
        this.created = res.data.total;
      } else {
        if (res.code === 403) {
          this.$store.commit("logout", this);
          this.$router.push({
            name: "login"
          });
        } else {
          this.$Message.error(res.msg);
        }
      }
    });
    // this.init();
    this.getList();
  },
  methods: {
    changePage(page) {
      this.tableShow.currentPage = page;
      this.getList();
    },
    changeSize(size) {
      this.tableShow.pageSize = size;
      this.getList();
    },
    getList() {
      axios
        .get(resourse, {
          params: {
            page: this.tableShow.currentPage,
            size: this.tableShow.pageSize
          }
        })
        .then(response => {
          let res = response.data;
          if (res.code === 200) {
            this.tableData = res.data.list;
            this.tableShow.listCount = res.data.count;
          } else {
            if (res.code === 403) {
              this.$store.commit("logout", this);
              this.$router.push({
                name: "login"
              });
            } else {
              this.$Message.error(res.msg);
            }
          }
        });
    }
  }
};
</script>

